<template>
  <div class="main_box">
    <el-row>
      <el-col :span="12">
        <Crumbs></Crumbs>
      </el-col>
      <el-col :span="12">
        <div class="opration_wrap">
          <el-button type="primary" icon="fa fa-mail-forward" @click="returnList">返回</el-button>
        </div>
      </el-col>
    </el-row>
    <div class="detail_wrap">
      <div class="tit">
        <h2>基础信息</h2>
      </div>
      <div class="con">
        <ul>
          <li>
            <label class="label">客户编号</label>
            <span>{{DetailData.customerCode}}</span>
          </li>
          <li>
            <label class="label">客户昵称</label>
            <span>{{DetailData.customerNickName}}</span>
          </li>
          <li>
            <label class="label">手机号码</label>
            <span>{{DetailData.customerTel}}</span>
          </li>
          <li>
            <label class="label">身份证号</label>
            <span>{{DetailData.cardId}}</span>
          </li>
          <li>
            <label class="label">银行账号</label>
            <span>{{DetailData.bankAccountNo}}</span>
          </li>
          <li>
            <label class="label">开户银行</label>
            <span>{{DetailData.openBank}}</span>
          </li>
          <li>
            <label class="label">可提现金额</label>
            <span>{{DetailData.cashMoney}}</span>
          </li>
        </ul>
      </div>
      <div class="add_con">
        <el-form :model="addForm" ref="addForm" label-width="160px" :rules="roleRules">
          <el-row>
            <el-form-item label="提现金额" prop="cashMoney" style="width:300px;">
              <el-input v-model="addForm.cashMoney"></el-input>
            </el-form-item>
          </el-row>
          <el-row>
            <el-form-item>
              <el-button type="primary" @click="sureClick">申请</el-button>
              <el-button @click="returnList">取 消</el-button>
            </el-form-item>
          </el-row>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
import Crumbs from "@/components/Crumbs";
import * as validators from "@/utils/validators";
import * as message from "@/constants/message";
import { FORMAT_DATE_YYYY_MM_DD } from "@/constants/constants";
export default{
    data(){
        return {
          addForm:{
            cashMoney: ""
          },
          DetailData: "",
          roleRules: {
            cashMoney: [
              { required: true, message: "请输入提现金额", trigger: "blur" },
            ]
          }
        }
    },
    components:{
      Crumbs
    },
    methods:{
      init(){
        this.getData();
      },
      getData(){
        this.$Get(this.$Config.api.customerAccountInfo, {customerId:this.$route.query.id})
        .then(res => {
          this.DetailData = res.data
        })
      },
      sureClick(){
        this.$refs.addForm.validate(valid => {
          if (valid) {
            this.$confirm(message.MSG_CONFIRM_SAVE_ALTER, message.TITLE_PROMPT, {})
              .then(() => {
              this.addTable();
          });
          }
        })
      },
      addTable() {
        let addData = {
          customerId: this.$route.query.id,
          cashMoney: this.addForm.cashMoney
        };
        this.$Post(this.$Config.api.customerAccountCash, addData)
        .then(data => {
          this.$message({
            type: 'success',
            message: message.MSG_ACTION_SUCCESS
          });
          this.returnList();
        })
        .catch(error => {
            if (error.msg) {
            this.$message.error(message.MSG_ACTION_FAIL);
          }
        })
      },
      returnList(){
        this.$router.push({path: '/money/customerAccountManagement'})
      }
    },
    mounted(){
      this.init();
    }
}
</script>
<style lang="scss" src="@/assets/css/views/Detail.scss" scope>
</style>
